<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>login</title>
    <link rel="stylesheet" type="text/css" href="../css/login.css" />
    <script type="text/javascript" src="../js/login.js"></script>
    <script src="../js/tools.js"></script>
</head>

<body>
    <div class="nav">
        <div class="nav1">
            <div class="left">
                <ul>
                    <li class="li1">订阅电子杂志</li>
                    <li>客服中心</li>
                    <li><img src="../images/nav1.png" alt="" width="30px" height="30px"></li>
                    <li><img src="../images/nav2.png" alt="" width="30px" height="30px"></li>
                </ul>
                <p>选择适合您的产品</p>
            </div>
            <div class="mid">
                <img src="../images/nav3.png" alt="" width="450px" height="140px">
            </div>
            <div class="right">
                <ul>
                    <li class="li2">登录</li>
                    <li>购物袋</li>
                </ul>
                <ol>
                    <li class="li3">查看所有产品</li>
                    <li>先试后买计划</li>
                    <li><input type="search" placeholder="高保湿霜"></li>
                </ol>
            </div>
        </div>
        <div class="box">
            <ul>
                <li class="active">生日派对</li>
                <li>面部护理</li>
                <li>身体护理</li>
                <li>男士护理</li>
                <li>头发护理</li>
                <li>认识KIEH'S</li>
                <li>K星人俱乐部</li>
            </ul>
            <ol>
                <li class="active">
                    <div>
                        <p class="p1">上市新品</p>
                        <p>臻选套装</p>
                        <p>十大明星产品</p>
                        <p>科颜氏的创新</p>

                    </div>
                    <img src='../images/nav4.png'>
                </li>
                <li>
                    <div class=o2div1>
                        <p class="p1"><b>按功能</b></p>
                        <p>所有产品</p>
                        <p>洁面/磨砂膏</p>
                        <p>面膜</p>
                        <p>明星爽肤水</p>
                        <p>精华液</p>
                        <p>乳液/面霜</p>
                        <p>防晒隔离</p>
                        <p>眼部/唇部护理</p>
                        <p>特殊护理</p>
                    </div>
                    <div class=o2div2>
                        <p class="p1"><b>按系列</b></p>
                        <p>高保湿系列</p>
                        <p>金盏花系列</p>
                        <p>亚马逊白泥净致系列</p>
                        <p>集焕白系列</p>
                        <p>高保湿清爽系列</p>
                        <p>夜间修护系列</p>
                        <p>多重紧致修颜系列</p>
                        <p>皮肤专家系列</p>
                        <p>蓝色草本系列</p>
                    </div>
                    <div class=o2div3>
                        <p class="p1"><b>按肤质</b></p>
                        <p>干性</p>
                        <p>干性至中性</p>
                        <p>中性</p>
                        <p>中性至油性</p>
                        <p>油性</p>
                        <p>痘痘肌</p>
                        <p>敏感肌</p>
                    </div>
                    <img src="../images/nav5.png" width="300px">
                </li>
                <li>
                    <div class=o3div1>
                        <p class="p1"><b>按功能</b></p>
                        <p>所有产品</p>
                        <p>身体保湿</p>
                        <p>身体清洁/去角质</p>
                        <p>手足护理</p>
                        <p>香氛</p>
                        <p>婴儿护理</p>
                        <p>宠物护理</p>
                    </div>
                    <div class=o3div2>
                        <p class="p1"><b>按系列</b></p>
                        <p>全身保湿系列</p>
                        <p>原香系列</p>
                        <p>纯净香氛身体护理系列</p>
                        <p>婴儿系列</p>
                        <p>拥抱宠物系列</p>
                    </div>
                    <div class=o3div3>
                        <p class="p1"><b>按肤质</b></p>
                        <p>干性</p>
                        <p>中性</p>
                        <p>油性</p>
                        <p>痘痘肌</p>
                        <p>敏感肌</p>
                    </div>
                    <img src="../images/nav6.png" width="300px">
                </li>
                <li>
                    <div class=o4div1>
                        <p class="p1"><b>按功能</b></p>
                        <p>所有产品</p>
                        <p>洁面/剃须</p>
                        <p>爽肤</p>
                        <p>面部滋养</p>
                        <p>眼部/唇部护理</p>
                        <p>其他护理</p>
                    </div>
                    <div class=o4div2>
                        <p class="p1"><b>按系列</b></p>
                        <p>活力保湿系列</p>
                        <p>清爽净致系列</p>
                        <p>淡纹紧实系列</p>
                        <p>绅士理容系列</p>
                    </div>
                    <img src="../images/nav7.png" width="300px">
                </li>
                <li>
                    <div class=o5div1>
                        <p class="p1"><b>按功能</b></p>
                        <p>所有产品</p>
                        <p>洗发水</p>
                        <p>护发素</p>
                        <p>修复</p>
                    </div>
                    <div class=o5div2>
                        <p class="p1"><b>按系列</b></p>
                        <p>橄榄油滋润护发系列</p>
                        <p>大米小麦系列</p>
                        <p>向日葵护色系列</p>
                        <p>氨基椰香系列</p>
                    </div>
                    <div class=o5div3>
                        <p class="p1"><b>按发质</b></p>
                        <p>极干性至干性</p>
                        <p>中性</p>
                        <p>中性至油性</p>
                        <p>纤细及单薄发质</p>
                        <p>染发及受损发质</p>
                    </div>
                    <img src="../images/nav8.png" width="300px">
                </li>
                <li>
                    <div class="o6div1">
                        <p class="p1">品牌历史</p>
                        <p>天然成分</p>
                        <p>健康肌肤</p>
                        <p>明星产品</p>
                        <p>回馈社会</p>
                    </div>
                </li>
            </ol>
        </div>

    </div>

    <div id="login_frame">
        <div class="login_ff">
            <p id="image_logo"><img src="../images/log3.png" width="100px"></p>

            <form method="post" action="login.js">
                <center>
                    <caption>
                        <h2>登录</h2>
                    </caption>
                    <table>
                        <tbody>
                            <tr height="30px">
                                <td>*用户名</td>
                            </tr>
                            <tr height="30px">
                                <td><input type="text" name="username" placeholder="用户名"></td>
                            </tr>
                            <tr height="30px">
                                <td>*您的密码</td>
                            </tr>
                            <tr height="30px">
                                <td><input type="password" name="password" placeholder="密码"></td>
                            </tr>
                            <tr height="30px">
                                <td>*您的手机号</td>
                            </tr>
                            <tr height="30px"> 
                                <td><input type="text" name="celephone" placeholder="手机号"></td>
                            </tr>
                        </tbody>
                    </table>
                </center>
                
                
               <hr>

                <input id="login_control" type="button" id="btn_login" value="登录" οnclick="login();">

                <div class="dd">
                    <a id="forget_zc" href="../html/zc.html">注册</a>
                    <a id="forget_pwd" href="userinfo.html">忘记密码？</a>
                </div>

            </form>
        </div>

    </div>

    <div class="bot">
        <img src="../images/bot1.png" width="100%">
        <div class="bot1">
            <ul>
                <li class="bli1">
                    <ol>
                        <li><b>面部护理</b></li>
                        <li>洁面/磨砂膏</li>
                        <li>面膜</li>
                        <li>明星爽肤水</li>
                        <li>精华液</li>
                        <li>乳液/面霜</li>
                        <li>防晒隔离</li>
                        <li>眼部/唇部护理</li>
                        <li>特殊护理</li>
                    </ol>
                </li>
                <li>
                    <ol>
                        <li><b>身体护理</b></li>
                        <li>身体保湿</li>
                        <li>身体清洁/去角质</li>
                        <li>手足护理</li>
                        <li>香氛</li>
                        <li>婴儿护理</li>
                        <li>宠物护理</li>
                    </ol>
                </li>
                <li>
                    <ol>
                        <li><b>男士护理</b></li>
                        <li>洁面/剃须</li>
                        <li>爽肤</li>
                        <li>面部滋养</li>
                        <li>眼部/唇部护理</li>
                        <li>造型</li>
                        <li>其他护理</li>
                    </ol>
                </li>
                <li>
                    <ol>
                        <li><b>头发护理</b></li>
                        <li>洗发水</li>
                        <li>护发素</li>
                        <li>修护</li>
                    </ol>
                </li>
                <li>
                    <ol>
                        <li><b>其他</b></li>
                        <li>甄选套组</li>
                    </ol>
                </li>
            </ul>
        </div>
        <div class="bot2">
            <div class="bot3">
                <p>订阅电子杂志</p>
                <input type="email" class="ty1" value="输入你的邮箱"><button>立即订阅</button><br>
                <input type="checkbox"
                    class="ty2"><span>我同意依照本<a><b>使用条款</b></a>和<a><b>隐私政策</b></a>对我的个人信息进行收集和使用；我已阅读并确认被给予充分机会理解该<a><b>使用条款</b></a>和<a><b>隐私政策</b></a>的内容。</span>
            </div>
            <div class="bot4">
                <ul>
                    <li>
                        <ol>
                            <li><b>关注我们</b></li>
                            <li>
                                <img src="../images/nav9.png" width="20px">
                                官方微博
                            </li>
                            <li>
                                <img src="../images/nav10.png" width="20px">
                                官方微信
                            </li>
                            <li>
                                <img src="../images/nav11.png" width="20px">
                                K星人俱乐部
                            </li>
                        </ol>
                    </li>
                    <li class="bot4li">
                        <ol>
                            <li><b>联系我们</b></li>
                            <li>欧莱雅（中国）有限公司</li>
                            <li>地址：上海静安区南京西路1601号</li>
                        </ol>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="bot_bot">
        <p>国家药监局提示您：宣称用于祛斑美白、防晒、染发、烫发等的化妆品为特殊用途化妆品，产品标签上应标注“国妆特字”或者“国妆特进字”的标准文号。</p>
        <ul>
            <li>© L'Oréal China 欧莱雅（中国）有限公司版权所有</li>
            <li>
                <img src="../images/nav12.png" width="15px">
                <a>中国工商 沪ICP备08100043号-15</a>
            </li>
            <li>
                <img src="../images/nav13.png" width="15px">
                <a>沪公网安备31010602001527</a>
            </li>
            <li><img src="../images/nav14.png" id="botimg">
        </ul>
        <p>Cookies政策|使用条款|隐私政策</p>
    </div>

</body>
<script>
    login();
</script>

</html>